<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@include file="/pages/jyy/jsandcss.jsp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>生产图表</title>
<script type="text/javascript">
$(function () {
	$('#d1').hide();
	$('#d2').hide();
	$('#d3').hide();
	$('#d4').hide();

    //1.初始化Table
    var oTable = new TableInit();
    oTable.Init();

    //2.初始化Button的点击事件
    var oButtonInit = new ButtonInit();
    oButtonInit.Init();


    //点击日期选择
	 $('#txt_search_time').change(function () {
		 
		 
		$("#end_time").val(CurentTime());
		 
		 var dm=$('#txt_search_time').val();
		 
		 if (dm=='1') {
				
			 $("#atart_time").val(CurentTime());
			 
		} else if (dm=='3'){
			
			$("#atart_time").val(getPreMonth(CurentTime()));
				
		} else if (dm=='2') {
			
			 $("#atart_time").val(getWeek());
			
		} else if(dm=='0') {
			$("#atart_time").val('');
			 $("#end_time").val('');
		}
		 $('#atart_time').datetimepicker('update'); 
	 });
    
});

/**
 * 获取当前时间
 * 格式为yyyy-mm-dd的日期
 */
 function CurentTime() {
	 
	 var date = new Date();
	    var seperator1 = "-";
	    var seperator2 = ":";
	    var month = date.getMonth() + 1;
	    var strDate = date.getDate();
	    if (month >= 1 && month <= 9) {
	        month = "0" + month;
	    }
	    if (strDate >= 0 && strDate <= 9) {
	        strDate = "0" + strDate;
	    }
	    var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate;
	    return currentdate;
 }
 
 /**
  * 获取上一个月
  *
  * @date 格式为yyyy-mm-dd的日期，如：2014-01-25
  */
 function getPreMonth(date) {
     var arr = date.split('-');
     var year = arr[0]; //获取当前日期的年份
     var month = arr[1]; //获取当前日期的月份
     var day = arr[2]; //获取当前日期的日
     var days = new Date(year, month, 0);
     days = days.getDate(); //获取当前日期中月的天数
     var year2 = year;
     var month2 = parseInt(month) - 1;
     if (month2 == 0) {
         year2 = parseInt(year2) - 1;
         month2 = 12;
     }
     var day2 = day;
     var days2 = new Date(year2, month2, 0);
     days2 = days2.getDate();
     if (day2 > days2) {
         day2 = days2;
     }
     if (month2 < 10) {
         month2 = '0' + month2;
     }
     var t2 = year2 + '-' + month2 + '-' + day2;
     return t2;
 }
 
 /*
 * 获取上周日期
 * 格式:yyyy-MM-dd
 */
 function getWeek() {
	 
	 var now = new Date();
	 var date = new Date(now.getTime() - 7 * 24 * 3600 * 1000);
	 var year = date.getFullYear();
	 var month = date.getMonth() + 1;
	 if (month < 10) {
		month = '0'+month;
	}
	 
	 var day = date.getDate();
	 
	 if (day < 10) {
		 day = '0'+day;
	}
	 
	 var xingqi=year + '-' + month + '-' + day;
	 //alert(year + '-' + month + '-' + day  + ' ' + hour + ':' + minute + ':' + second);
	 return xingqi;
 }



var TableInit = function () {
    var oTableInit = new Object();
    //初始化Table
    oTableInit.Init = function () {
        $('#tb_departments').bootstrapTable({
            url: '${pageContext.request.contextPath }/jy/selectProductNum.do',//生产数量统计
            method: 'get',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10,20,30],         //可供选择的每页的行数（*）
            clickToSelect: true,                //是否启用点击选中行
            height: 500,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "ID",                     //每一行的唯一标识，一般为主键列
            detailView: false,                   //是否显示父子表
            columns: [{
                checkbox: true
            }, {
                field: 'cartype',
                title: '车种'
            }, {
                field: 'pnum',
                title: '品编'
            }, {
                field: 'pname',
                title: '品名'
            }, {
                field: 'pcolor',
                title: '颜色'
            }, {
            	field: 'remartk5',
                title: '生产数量'
            }]
        });
        $('#tb_orders').bootstrapTable({
            url: '${pageContext.request.contextPath }/jy/selectPinzhi.do',  //品质现况统计
            method: 'get',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10,20,30],         //可供选择的每页的行数（*）
            clickToSelect: true,                //是否启用点击选中行
            height: 500,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "ID",                     //每一行的唯一标识，一般为主键列
            detailView: false,                   //是否显示父子表
            columns: [ [{
				field : 'cartype',
				valign : 'middle',
				align : "center",
				title : '车种',
				rowspan : 2,
				colspan : 1
			}, {
				field : 'nmum',
				valign : 'middle',
				align : 'center',
				title : '品编',
				rowspan : 2,
				colspan : 1
			}, {
				field : 'pname',
				valign : 'middle',
				align : 'center',
				title : '品名',
				rowspan : 2,
				colspan : 1
			}, {
				field : 'color',
				valign : 'middle',
				align : 'center',
				title : '颜色',
				rowspan : 2,
				colspan : 1
			}, {
				field : 'snum',
				valign : 'middle',
				align : 'center',
				title : '生产数量',
				rowspan : 2,
				colspan : 1
			}, {
				field : 'good',
				valign : 'middle',
				align : 'center',
				title : '良品数量',
				rowspan : 2,
				colspan : 1
			}, {
				field : 'ngood',
				valign : 'middle',
				align : 'center',
				title : '不良品数量',
				rowspan : 2,
				colspan : 1
			}, {
				field : 'rate',
				valign : 'middle',
				align : 'center',
				title : '不良率',
				rowspan : 2,
				colspan : 1
			}, {
				title : "不良品类型",
				valign : 'middle',
				align : "center",
				rowspan : 1,
				colspan : 4,
			} ], [ {
				field : 'nForming',
				align : 'center',
				title : '未成型'
			}, {
				field : 'deckleEdge',
				align : 'center',
				title : '毛边'
			}, {
				field : 'coldMetal',
				align : 'center',
				title : '冷料'
			}, {
				field : 'brightMark',
				align : 'center',
				title : '亮印'
			} ] ]
        });
        
        $('#tb_orders1').bootstrapTable({
            url: '${pageContext.request.contextPath }/jy/selectProductNum.do',//生产计划对比实绩
            method: 'get',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10,20,30],         //可供选择的每页的行数（*）
            clickToSelect: true,                //是否启用点击选中行
            height: 500,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "ID",                     //每一行的唯一标识，一般为主键列
            detailView: false,                   //是否显示父子表
            columns: [{
                checkbox: true
            }, {
                field: 'cartype',
                title: '车种'
            }, {
                field: 'pnum',
                title: '品编'
            }, {
                field: 'pname',
                title: '品名'
            }, {
                field: 'remartk1',
                title: '生产计划量'
            }, {
                field: 'remartk5',
                title: '实际生产量'
            }, {
                field: 'remartk6',
                title: '达成率'
            }]
        });
        
        $('#tb_orders2').bootstrapTable({
            url: '${pageContext.request.contextPath }/jy/selectEqupmentStart.do',//设备启动率
            method: 'get',                      //请求方式（*）
            toolbar: '#toolbar',                //工具按钮用哪个容器
            striped: true,                      //是否显示行间隔色
            cache: false,                       //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
            pagination: true,                   //是否显示分页（*）
            sortable: false,                     //是否启用排序
            sortOrder: "asc",                   //排序方式
            queryParams: oTableInit.queryParams,//传递参数（*）
            sidePagination: "server",           //分页方式：client客户端分页，server服务端分页（*）
            pageNumber:1,                       //初始化加载第一页，默认第一页
            pageSize: 10,                       //每页的记录行数（*）
            pageList: [10,20,30],         //可供选择的每页的行数（*）
            clickToSelect: true,                //是否启用点击选中行
            height: 500,                        //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
            uniqueId: "ID",                     //每一行的唯一标识，一般为主键列
            detailView: false,                   //是否显示父子表
            columns: [{
                checkbox: true
            }, {
                field: 'id',
                title: '设备编号'
            }, {
                field: 'name',
                title: '设备名称'
            }, {
                field: 'pass',
                title: '吨位数'
            }, {
                field: 'pass',
                title: '生产数量'
            }, {
                field: 'pass',
                title: '启动时间'
            }, {
                field: 'pass',
                title: '非启动时间'
            }, {
                field: 'pass',
                title: '启动率'
            }]
        });
        
    };

    //得到查询的参数
    oTableInit.queryParams = function (params) {
        var temp = {   //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
            limit: params.limit,   //页面大小
            offset: params.offset,  //页码
            stime: $("#atart_time").val(),
            etime: $("#end_time").val()
        };
        return temp;
    };
    return oTableInit;
};


var ButtonInit = function () {
    var oInit = new Object();
    var postdata = {};

    oInit.Init = function () {
        //初始化页面上面的按钮事件
    };

    return oInit;
};

function show() {
	var data=$("input[type='radio']:checked").val();
	if (data==1) {
		$('#d1').show();
		$('#d2').hide();
		$('#d3').hide();
		$('#d4').hide();
		$('#tb_departments').bootstrapTable('refresh');
		
	} else if (data==2) {
		$('#d2').show();
		$('#d1').hide();
		$('#d3').hide();
		$('#d4').hide();
		$('#tb_orders').bootstrapTable('refresh');
	} else if (data==3) {
		$('#d3').show();
		$('#d1').hide();
		$('#d2').hide();
		$('#d4').hide();
		$('#tb_orders1').bootstrapTable('refresh');
	} else if (data==4) {
		$('#d4').show();
		$('#d1').hide();
		$('#d2').hide();
		$('#d3').hide();
		$('#tb_orders2').bootstrapTable('refresh');
	} ;
	
}
</script>
<script type="text/javascript">
 $(function () {
	$(".form_datetime").datetimepicker({
	 format: "yyyy-mm-dd",
	 autoclose: true,
	 todayBtn: true,
	 todayHighlight: true,
	 showMeridian: true,
	 pickerPosition: "bottom-left",
	 language: 'zh-CN',//中文，需要引用zh-CN.js包
	 startView: 2,//月视图
	 minView: 2//日期时间选择器所能够提供的最精确的时间选择视图
	 });
 });
</script>
</head>
<body>
	<div class="panel-body" style="padding-bottom:0px;">
        <div class="panel panel-default">
            <div class="panel-heading">查询条件</div>
            <div class="panel-body">
                <form id="formSearch" class="form-horizontal">
                    <div class="form-group" style="margin-top:15px">
                         <label class="control-label col-sm-1" for="txt_search_departmentname">日期:</label>
                        <div class="col-sm-2">
                            <select id="txt_search_time" name="materienumber" class="form-control">
		                         <option value="0">所有时间</option>
		                         <option value="1">最近一天</option>
		                         <option value="2">最近一星期</option>
		                         <option value="3">最近一个月</option>
                        	 </select>
                        </div>
                        <label class="control-label col-sm-1" for="txt_search_statu" style="width: 30px;">从</label> 
                        <div class="col-sm-2">
                        	<input class="form_datetime form-control" type="text" id="atart_time" name="arrtime" readonly >
                        </div>
                        <label class="control-label col-sm-1" for="txt_search_statu"  style="width: 30px;padding-left: 0px;">至</label> 
                        <div class="col-sm-2" style="padding-left: 0px;">
                        	<input class="form_datetime form-control"  type="text" id="end_time" name="arrtime" readonly >
                        </div>
                        <br><br>
                        <div class="form-group" style="margin-top:15px;margin-left: 70px">
                        <label class="control-label col-sm-1" for="txt_search_departmentn"><input type="radio" name="main" value="1">生产数量统计</label>
                        <label class="control-label col-sm-1" for="txt_search_departmentnam" style="width: 188px;"><input type="radio" name="main" value="2">品质现况统计</label>
                        <label class="control-label col-sm-1" for="txt_search_departmentnam" style="width: 188px;"><input type="radio" name="main" value="3">生产计划对比实绩</label>
                        <!-- <label class="control-label col-sm-1" for="txt_search_departmentnam" style="width: 188px;"><input type="radio" name="main" value="4">设备启动率</label> -->
                        <div class="col-sm-1" style="text-align:left;">
                            <button type="button" style="margin-left:50px" id="btn_query" class="btn btn-primary" onclick="show()">查询</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>       

      <!--   <div id="toolbar" class="btn-group">
            <button id="btn_add1" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>图形报表
            </button>
            <button id="btn_edit" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>导出打印
            </button>
        </div>
        <div id="toolbar" class="btn-group">
            <button id="btn_add2" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>图形报表
            </button>
            <button id="btn_edit" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>导出打印
            </button>
        </div>
        <div id="toolbar" class="btn-group">
            <button id="btn_add3" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>图形报表
            </button>
            <button id="btn_edit" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>导出打印
            </button>
        </div>
        <div id="toolbar" class="btn-group">
            <button id="btn_add4" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>图形报表
            </button>
            <button id="btn_edit" type="button" class="btn btn-default">
                <span class="glyphicon glyphicon-pencil" aria-hidden="true"></span>导出打印
            </button>
        </div> -->
        
        <div id="d1"><table id="tb_departments"></table></div>
        <div id="d2"><table id="tb_orders"></table></div> 
        <div id="d3"><table id="tb_orders1"></table></div> 
        <div id="d4"><table id="tb_orders2"></table></div> 
    </div>
</body>
</html>